import React, { Component } from 'react';
import { Icon, Menu } from 'antd';
import {createHashHistory} from 'history'
import MyIcon from "MyIcon/MyIcon";
const history = createHashHistory()

const SubMenu = Menu.SubMenu

export default class Head extends Component {
    constructor(props) {
        super(props)
        this.state = {
            collapsed: false,
        }
    }

    componentDidMount() {

    }

    componentWillUnmount(){

    }


    render() {
        return (
            <div className={!this.state.collapsed ? 'head' : 'head-flod'}>
                {/*<div className={this.state.collapsed ? "head-logo-flod" : "head-logo"}>*/}
                    {/*/!*<Tooltip placement="right" title="首页">*!/*/}
                    {/*<li className="home-li">*/}
                        {/*<a className="head-home" href="#/system/registrymanage" >*/}
                            {/*<span>  <IconFont type="icon-shouye"/></span>*/}
                            {/*<span className={this.state.collapsed ? 'sider-name' : null}>首&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;页</span>*/}
                        {/*</a>*/}
                    {/*</li>*/}

                    {/*/!*</Tooltip>*!/*/}


                {/*</div>*/}
                {/*<a href="#/" className={this.state.collapsed ? "head-logo-flod" : "head-logo"}>*/}
                    {/*<img src='/static/images/logo2.png' width={this.state.collapsed ? 60 : 120} height={55*120/140} />*/}
                {/*</a>*/}
                <a href="javascript:void(0);"  style={{color:"#313a43"}} onClick={this.toggleCollapsed} >
                    <Icon type={this.state.collapsed ? 'menu-unfold' : 'menu-fold'} style={{ fontSize: '20px',margin:"25px 0 0 10px"}}/>
                </a>
                {/*<Icon type={this.state.collapsed ? 'menu-unfold' : 'menu-fold'} onClick={this.toggleCollapsed} style={{ fontSize: '20px',margin:"20px 0 0 10px"}}/>*/}
                {/*<span className="system-title">宜邻购品牌商、经销商管理系统</span>*/}

                <div className="head-nav">
                    <Menu mode="horizontal">
                        <SubMenu
                            title={
                                <span>
                                    <MyIcon type="user" />
                                    {"yueylong"}
                                </span>
                            }
                        >
                            <Menu.Item key="setting:user4">
                                <a href="javascript:void(0);" onClick={()=>this._changePassword(true)}>
                                    修改密码
                                </a>
                            </Menu.Item>
                            <Menu.Item key="setting:user3">
                                <a href="javascript:void(0);" onClick={this._loginout}>
                                    退出
                                </a>
                            </Menu.Item>
                        </SubMenu>
                    </Menu>
                </div>

            </div>
        )
    }

    _loginout() {
        window.location.href = "/index.html"
    }

    _changePassword = (flag) =>{
    }

    toggleCollapsed = () =>{
        let collapsed = !this.state.collapsed
        this.setState({
            collapsed: !this.state.collapsed,
        });
        this.props.callback(collapsed);
    }
}
